<template>
	<view>
		<view v-if="boardInfo!==null" style="width: 94%;margin-left: 3%;">
			<!-- 顶部 -->
			<view style="display: flex;justify-content: space-between;margin-top: 10rpx;">
				<view style="display: flex;">
					<view><img style="width: 100rpx;" :src="boardInfo.boaUserAvatar" alt=""></view>
					<view style="margin-left: 10rpx;">
						<view style="margin-bottom: 12rpx;font-size: smaller;">{{boardInfo.boaUserName}}
						</view>
						<view style="font-size: small;color: #808080;">{{boardInfo.createAt}}</view>
					</view>
				</view>
				<view class="fontStyle" style="display: flex;align-items: center;">
					{{boardInfo.boaViews}} 浏览量
				</view>
			</view>
			<view style="margin-top: 20rpx;color: #808080;display: flex;justify-content: center;">
				<span style="width: 96%;">{{boardInfo.boaContent}}</span>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				boaId: null,
				boardInfo: null
			}
		},
		onLoad: function(option) {
			this.boaId = option.id;
			this.getBoardDetail()
		},
		onShow() {
			this.getBoardDetail()
		},
		// 右上角更多
		onNavigationBarButtonTap: function(e) {
			var that = this;
			uni.showActionSheet({
				itemList: ['编辑公告', '删除公告'],
				success: function(res) {
					if (res.tapIndex == 0) {
						// 跳转到编辑公告界面
						uni.navigateTo({
							url:'./editBoard?boaId='+that.boaId
						})
					} else if (res.tapIndex == 1) {
						// 删除公告，并跳转回去
						uni.showModal({
							title: '提示',
							confirmColor: 'red',
							content: '确定删除公告吗?',
							success: res => {
								if (res.confirm) {
									that.removeBoard();
								}
							}
						});
					}
				}
			});
		},
		methods: {
			// 获取公告详情
			getBoardDetail() {
				this.$http.request({
					url: `/organizations/web/boards/board/boa/${this.boaId}`
				}).then(res => {
					res = res.data;
					if (res.result) {
						this.boardInfo = res.data[0];
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			// 删除公告
			removeBoard() {
				this.$http.request({
					url: `/organizations/web/boards/board/${this.boaId}`,
					method: 'DELETE'
				}).then(res => {
					res = res.data;
					if(res.result){
						uni.showModal({
							content: res.msg,
							showCancel: false,
							success: res => {
								uni.navigateBack()
							}
						});
					}
					else{
						uni.showToast({
							title:res.msg
						})
					}
				})
			}
		}
	}
</script>

<style>
	.fontStyle {
		font-size: smaller;
		color: #808080;
	}
</style>
